﻿import QtQuick 2.3
import QtQuick.Controls 1.2
import QmlObjectTest 1.0
import QtQuick.Dialogs 1.2
import QtQuick.Window 2.2
import QtQuick.Controls.Styles 1.4
import QtQuick.Controls.Private 1.0

ApplicationWindow {
    id: window
    visible: true
    width: Screen.width
    height: Screen.height
    title: qsTr("抱抱")


    function clickHead(){
        if(animHead.running) return
        animHead.restart()
    }
    function clickLeft(){
        if(animLeft.running) return
        animLeft.restart()
    }
    function clickRight(){
        if(animRight.running) return
        animRight.restart()
    }


    Image{
        id: body
        anchors.centerIn: parent
        source: "qrc:/body.png"

        Image {
            id: left
            source: "qrc:/left.png"

            transform: Rotation{
                id: rotationLeft
                axis.x: 0
                axis.y: 0
                axis.z: 1
                origin.x: 218
                origin.y: 360
            }
        }
        Image {
            id: right
            source: "qrc:/right.png"

            transform: Rotation{
                id: rotationRight
                axis.x: 0
                axis.y: 0
                axis.z: 1
                origin.x: 340
                origin.y: 360
            }
        }
        Image {
            id: head
            source: "qrc:/head.png"

            transform: Rotation{
                id: rotationHead
                axis.x: 0
                axis.y: 0
                axis.z: 1
                origin.x: head.width/2
                origin.y: 310
            }
        }

        Rectangle{
            width: 300
            height: 310
            x: 120
            y: 0
            color: Qt.rgba(0,0,0,0)
            MouseArea{
                anchors.fill: parent
                onClicked: {
                    clickHead()
                }
            }
        }

        Rectangle{
            width: 200
            height: 135
            x: 36
            y: 334
            color: Qt.rgba(1,0,0,0)
            MouseArea{
                anchors.fill: parent
                onClicked: {
                    clickLeft()
                }
            }
        }

        Rectangle{
            width: 200
            height: 135
            x: 300
            y: 332
            color: Qt.rgba(0,1,0,0)
            MouseArea{
                anchors.fill: parent
                onClicked: {
                    clickRight()
                }
            }
        }

        Rectangle{
            width: 109
            height: 160
            x: 218
            y: 350
            color: Qt.rgba(0,1,0,0)
            MouseArea{
                anchors.fill: parent
                onClicked: {
                    animLeft.stop()
                    animRight.stop()
                    animLeft.restart()
                    animRight.restart()
                }
            }
        }
    }

    Button{
        text: "提示"
        anchors.right: parent.right
        style: ButtonStyle{}
        onClicked: {
            messageDialog.visible = true
        }
    }

    MessageDialog{
        id: messageDialog
        title: "操作方式"
        informativeText: "点击头部，手部，身体！"
        onAccepted: {
        }
    }

    SequentialAnimation{
        id: animHead
        PropertyAnimation{target: rotationHead; property: "angle"; from: 0; to: 15; duration: 500}
        PropertyAnimation{target: rotationHead; property: "angle"; from: 15; to: -15; duration: 1000}
        PropertyAnimation{target: rotationHead; property: "angle"; from: -15; to: 0; duration: 500}
    }
    SequentialAnimation{
        id: animLeft
        PropertyAnimation{target: rotationLeft; property: "angle"; from: 0; to: 15; duration: 500}
        PropertyAnimation{target: rotationLeft; property: "angle"; from: 15; to: -15; duration: 1000}
        PropertyAnimation{target: rotationLeft; property: "angle"; from: -15; to: 0; duration: 500}
    }
    SequentialAnimation{
        id: animRight
        PropertyAnimation{target: rotationRight; property: "angle"; from: 0; to: -15; duration: 500}
        PropertyAnimation{target: rotationRight; property: "angle"; from: -15; to: 15; duration: 1000}
        PropertyAnimation{target: rotationRight; property: "angle"; from: 15; to: 0; duration: 500}
    }
}

